<template>
	<view>
		<view style="position: relative;">
			<image @click="toPage('/pages/show/index?img=https://sxdj.zhiyunapi.com/coach/show/image/info.jpg&title=个人信息')" src="https://sxdj.zhiyunapi.com/coach/show/image/user1.jpg" mode="widthFix" style="width: 100%;"></image>
		<view style="position: absolute;left: 0;right: 0;bottom: 0;height: 40px;z-index: 1;" @click="toPage('/pages/show/index?img=https://sxdj.zhiyunapi.com/coach/show/image/m1.jpg')"></view>
		</view>
		<view class="p15 pt10">


			<view class="u-f-item bg-white brs5 p15">
				<view class="u-f1 u-f-justify u-f-column" @click="toPage('/pages/show/index?img=https://sxdj.zhiyunapi.com/coach/show/image/m2.jpg&title=我的余额')">
					<view class="fz16 fzw700">0.00</view>
					<view class="fz12 mt5 fz12">余额</view>
				</view>
				<view class="u-f1 u-f-justify u-f-column" @click="toPage('/pages/show/index?img=https://sxdj.zhiyunapi.com/coach/show/image/m3.jpg&title=我的积分')">
					<view class="fz16 fzw700">0</view>
					<view class="fz12 mt5 fz12">积分</view>
				</view>
				<view class="u-f1 u-f-justify u-f-column" @click="toPage('/pages/show/index?img=https://sxdj.zhiyunapi.com/coach/show/image/m4.jpg&title=我的卡')">
					<view class="fz16 fzw700">0</view>
					<view class="fz12 mt5 fz12">卡</view>
				</view>
				<view class="u-f1 u-f-justify u-f-column" @click="toPage('/pages/show/index?img=https://sxdj.zhiyunapi.com/coach/show/image/m5.jpg&title=我的优惠券')">
					<view class="fz16 fzw700">2</view>
					<view class="fz12 mt5 fz12">优惠券/码</view>
				</view>
			</view>
			<view class="mt10">

				<u-swiper @click="toInfo" :list="bannerList" height="200" border-radius="10"></u-swiper>
			</view>

			<view class="bg-white brs5  mt10" @click="toPage('/pages/show/index?img=https://sxdj.zhiyunapi.com/coach/show/image/d1.jpg&title=我的订单')">
				<view class="c0 fz15 u-f-item u-f-jsb p15 bm">我的订单<span class="fz13 c8">查看全部订单<u-icon name="arrow-right"
							color="#888"></u-icon></span></view>
				<view class="p15 u-f-item u-f-jsb">
					<view>
						<image src="https://sxdj.zhiyunapi.com/coach/show/image/user2.png" class="w20 h20" style="margin: 0 auto;display: block;"></image>
						<view class="fz13">待付款</view>
					</view>
					<view>
						<image src="https://sxdj.zhiyunapi.com/coach/show/image/user3.png" class="w20 h20" style="margin: 0 auto;display: block;"></image>
						<view class="fz13">待发货</view>
					</view>
					<view>
						<image src="https://sxdj.zhiyunapi.com/coach/show/image/user4.png" class="w20 h20" style="margin: 0 auto;display: block;"></image>
						<view class="fz13">待收货</view>
					</view>
					<view>
						<image src="https://sxdj.zhiyunapi.com/coach/show/image/user5.png" class="w20 h20" style="margin: 0 auto;display: block;"></image>
						<view class="fz13">待评价</view>
					</view>
					<view>
						<image src="https://sxdj.zhiyunapi.com/coach/show/image/user6.png" class="w20 h20" style="margin: 0 auto;display: block;"></image>
						<view class="fz13">退款/售后</view>
					</view>
				</view>
			</view>
			<view class="bg-white brs5  mt10 pl15">
				<view class="u-f-item u-f-jsb pr15 pt10 pb10">
					<view class="u-f-item">
						<view class="u-f-justify w32">
							<image src="https://sxdj.zhiyunapi.com/coach/show/image/user7.png" class="w20 h20"></image>
						</view>
						<view class="pl10 fz13">购物车</view>
					</view>
					<u-icon name="arrow-right" color="#72767F"></u-icon>
				</view>
			</view>
			<view class="bg-white brs5  mt10 pl15">
				
				<view class="u-f-item u-f-jsb pr15 pt10 pb10 bm" @click="toPage('/pages/show/index?img=https://sxdj.zhiyunapi.com/coach/show/image/address.jpg&title=收货地址')">
					<view class="u-f-item">
						<view class="u-f-justify w32">
							<image src="https://sxdj.zhiyunapi.com/coach/show/image/user8.png" class="w20 h20"></image>
						</view>
						<view class="pl10 fz13">收货地址</view>
					</view>
					<u-icon name="arrow-right" color="#72767F"></u-icon>
				</view>
				<view class="u-f-item u-f-jsb pr15 pt10 pb10 bm">
					<view class="u-f-item">
						<view class="u-f-justify w32">
							<image src="https://sxdj.zhiyunapi.com/coach/show/image/user9.png" class="w20 h20"></image>
						</view>
						<view class="pl10 fz13">客服聊天</view>
					</view>
					<u-icon name="arrow-right" color="#72767F"></u-icon>
				</view>
				<view class="u-f-item u-f-jsb pr15 pt10 pb10 bm" @click="toPage('/pages/show/index?img=https://sxdj.zhiyunapi.com/coach/show/image/info.jpg&title=个人信息')">
					<view class="u-f-item">
						<view class="u-f-justify w32">
							<image src="https://sxdj.zhiyunapi.com/coach/show/image/user10.png" class="w20 h20"></image>
						</view>
						<view class="pl10 fz13">个人信息</view>
					</view>
					<u-icon name="arrow-right" color="#72767F"></u-icon>
				</view>
				
				<view class="u-f-item u-f-jsb pr15 pt10 pb10" @click="toPage('/pages/show/index?img=https://sxdj.zhiyunapi.com/coach/show/image/info.jpg&title=个人信息')">
					<view class="u-f-item">
						<view class="u-f-justify w32">
							<image src="https://sxdj.zhiyunapi.com/coach/show/image/user11.png" class="w20 h20"></image>
						</view>
						<view class="pl10 fz13">账号设置</view>
					</view>
					<u-icon name="arrow-right" color="#72767F"></u-icon>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {

				bannerList: ['https://sxdj.zhiyunapi.com/coach/show/image/banner.jpg', 'https://sxdj.zhiyunapi.com/coach/show/image/banner.jpg'],
			}
		},
		onShow() {},
		methods: {
			toPage(url){
				uni.navigateTo({
					url
				})
			}
		}
	}
</script>

<style>
	.status {
		border-radius: 50rpx;
		background: #FFF;
		display: flex;
		width: 96rpx;
		height: 44rpx;
		justify-content: center;
		align-items: center;
		gap: 4rpx;
		color: #0CA43C;
		font-size: 24rpx;
		margin-top: 15rpx;
	}

	/* 我的数据 */
	.conut-box {
		background: linear-gradient(0deg, #FFF 0%, #FFF 100%), radial-gradient(838.07% 242.05% at 100% 136.67%, rgba(44, 193, 87, 0.50) 0%, rgba(44, 193, 87, 0.50) 26.04%, rgba(44, 193, 87, 0.50) 53.13%, rgba(44, 193, 87, 0.50) 100%);
		box-shadow: 0px 4px 15px 0px rgba(44, 193, 87, 0.10);
		backdrop-filter: blur(15px);
	}

	.tdl-box {
		position: absolute;
		border-radius: 0 30rpx;
		background: linear-gradient(87deg, #CFEFD2 12.71%, rgba(207, 239, 210, 0.60) 93.11%);
		padding: 8rpx 16rpx;
		color: #0CA43C;
		font-size: 12px;
		top: 0;
		right: 0;
	}

	.tdl-box>text {
		color: #FF8A00;
	}

	.meun-list {
		display: flex;
		flex-wrap: wrap;
	}

	.meun-list>view {
		width: 25%;
	}
</style>